@import "_common";
@import "header";
@import "_footer";
.part1{
    @include bgBase (rgb(139, 192, 31));
    .container{
        padding-top: .60rem;
        padding-bottom: .94rem;
        color: #fff;
        font-size: .14rem;
        .left{
            @media screen and (max-width:767px) {
                width:100%;
            }
            .row{
                .col-md-2{
                    width: .58rem;
                    background: #fff;
                    font-size: .48rem;
                    color: rgb(139, 192, 31);
                    font-weight: bold;
                }
                .title{
                    font-size: .48rem;
                }
            }
            .title{
                margin-bottom: .15rem;
            }
            .small{
                font-size: .24rem;
                margin-bottom: .68rem;
            }
            .description{
                font-size: .14rem;
                line-height: 1.428;
            }
            .button{
                font-size: 0.14rem;
                .btn{
                    margin-top: .30rem;
                    padding: .12rem .22rem;
                    color: rgb(139, 192, 31);
                    background-color: #fff;
                }
            }
        }
        .right{
            img{
                width: 4.48rem;
                @media screen and (min-width:768px) {
                    margin-top: 1rem;
                }
                @media screen and (max-width:767px) {
                    
                    margin: 0 auto;
                    margin-top: .15rem;
                }
            }
            
        }
    }
}
.part2{
    @include bgBase (rgb(51, 147, 223));
    .container{
        padding-top: .60rem;
        padding-bottom: .60rem;
        color: #fff;
        font-size: .14rem;
        .row{
            .col-md-2{
                margin-left: .15rem;
                width: 5.3%;
                @media screen and (max-width:767px) {
                    width: 8.3%;
                    margin-right: 0.15rem;
                }
                @media screen and (min-width:320px) {
                    width: 15.3%;
                }
                color: rgb(51, 147, 223);
                background: #fff;
                font-size: 0.4rem;
                @media screen and (min-width:768px){
                    padding-right: 0.35rem;
                }
            }
            .title{
                font-size: .48rem;    
            }
            .center{
                .title{
                    margin-top: .30rem;
                    font-size: .24rem;
                    margin-bottom: .13rem;
                }
                .description{
                    line-height: 1.428;
                }
            }
            .left{
                img{
                    width: 3.03rem;
                }
            }
            .right{
                margin-top: 1.65rem;
                img{
                    width:2.64rem;
                }
                @media screen and (min-width:768px) {
                    margin-top: 0px;
                }
                
            }
            
        }
        @media screen and (max-width:767px) {
            .img-left,.right>img{
                margin: 0 auto!important;
                padding-top: .15rem;
            }
            .row .right{
                margin-top: 0;
            }
        }
    }
}
.part3{
    .container{
        padding-top: .91rem;
        padding-bottom: .80rem;
        color: #5d5d5d;
        font-size: .14rem;
        .col-md-6{
            width: 45%;
        }
        .col-md-5{
            width: 45%;
        }
        @media (max-width: 1024px){
            .col-md-6{
                width: 98%;
            }
            .col-md-5{
                width: 98%;
            }
        }
        img{
            width: 1.62rem;
        }
        .left,.right{
            padding-left: 0;
            padding-right: 0;
            .title{
                .col-md-2{
                    width: 9.6%;
                    margin-left: .15rem;
                    background: rgb(51, 147, 223);
                    color: #fff;
                    font-size: .36rem;
                    font-weight: bold;
                    @media screen and (min-width:768){
                        padding-right: 0;
                        width: 6.6%;
                        margin-right: .15rem;
                    }
                }
                .title{
                    color: rgb(51, 147, 223);
                    font-size: .42rem;
                    margin-bottom: .22rem;
                }
                .four{
                    margin-left: 0;
                }
            }
            .col-md-12{
                padding-left: 0;
            }
            .p1{
            
                margin-bottom:.36rem; 
                font-size: .18rem;

            }
            .p2{
                margin-top: .32rem;
                color: rgb(51, 147, 223);
                margin-bottom: .22rem;
            }
            .p3{
                text-indent: .25rem;
            }
            .p4{
                margin-top: .42rem;
                text-align: center;
                @media screen and (min-width:768px) {
                    text-align: right;
                }
            }
            .last{
                padding-bottom: .18rem;
            }
        }
    }
    .right{
        width: 46%;
        margin-left: .34rem;
        @media screen and (min-width:768px) {
            width:100%;
            .p4>img{
                margin-right: .6rem;
            }
        }
        @media screen and (max-width:767px) {
            width:100%;
            .p4>img{
                margin-right: .6rem;
            }
            .title{
                .title{
                    padding-left: 0;
                }
            }
        }
    }
    
}
@media screen and (min-width:320px){
    .part3{
        .container{
            .left{
                .title{
                    .col-sm-1{
                        width: 15.6%;
                    }
                }
            }
        }
    }
    .part3{
        .container{
            .right{
                .title{
                    .col-md-2{
                        width: 15.6%;
                    }
                }
            }
        }
    }
}
.part4{
    @extend .part3;
    @include bgBase(rgb(247, 247, 247));
}